<template>
  <div>
    <h2>侦听器</h2>
    <input type="text" v-model.lazy="uname" />
  </div>
</template>

<script>
export default {
  // data放数据；methods放方法；computed放计算属性；watch放侦听器；..............
  data() {
    return {
      uname: "zs",
    };
  },
  // 侦听器.要写在和 data 平级的  watch 里面
  watch: {
    // 1.----------- 函数写法 ------------

    // uname (newVal, oldVal) {
    //   console.log(newVal, oldVal)
    // }

    //2. ----------- 对象写法 -------------

    uname: {
      handler(newVal, oldVal) {
        // 写对象格式,handler必须写,名字固定
        console.log(newVal, oldVal);
      },
    },
  },
};
</script>

<style>
</style>